<template>
    <view class="homepage">
        <view class="flex-col wrapper" v-for="(j,index) in Paycost" :key="index">
            <view class="u-line-1 text">待缴金额</view>
            <view class="u-line-1 text-two">￥{{j.paymentAmount}}.00</view>
            <view class="flex-row wraper-row">
                <view class="box">
					<uni-icons style="top: 0rpx;left: 0px;" type="location" size="25"></uni-icons>
				</view>
                <view class="u-line-1 text-three">{{j.address}}</view>
            </view>
            <view class="flex-row wraper-row-two">
                <u-button class="button" type="info" size="medium" :hairLine="false" @click="ccc">
                    缴费记录
                </u-button>
                <u-button class="button-two" type="info" size="medium" :hairLine="false" @click="show=true">
                    缴费
                </u-button>
				
            </view>
			<view>
				<u-modal :show="show" :title="title" :content='content' :showCancelButton="true" @confirm="delet1(j)"
					@cancel="show=false">
				</u-modal>
			</view>
        </view>
    </view>
</template>
<script>
    export default {
        data() {
            return {
				adds1:{},
				Paycost:{},
				user:{},
				show:false,
				content: '当前您的余额充足，可从当前余额里扣除',
				title: '提示',
			}
        },
		onLoad(params) {
			this.adds1 = JSON.parse(params.j)
			console.log(this.adds1)
			this.ListAll()
		},
        methods: {
			
			delet1(j) {
				this.show = false
				var i=j.balance-j.paymentAmount
				j.balance=i
				j.paymentAmount=0.0
				console.log(j)
				this.$axios({
					url: 'serverwg/gwb/xgqs',
					data: j,
					method: 'POST',
					success: (res) => {
						if (res.data.code === 20000) {
							uni.showModal({
								content: '缴费成功',
								showCancel: false,
								success: (res) => {
									uni.navigateTo({
										url: '/pages/gwb/Lifepaycost'
									})
								}
							});
						}else{
							uni.showModal({
								content: '修改失败请重试',
								showCancel: false,
							})
						}
					}
				})
			},
			ccc(){
				uni.navigateTo({
					url: '/pages/gwb/Lifepayhistory'
				})
			},
			ListAll() {
				this.user = uni.getStorageSync('user')
				this.$axios({
					url: 'serverwg/gwb/GwbCommunitydt',
					data: {
						id: this.user.userId,
						type:this.adds1.type
					},
					method: 'GET',
					success: (res) => {
						this.Paycost = res.data.data.GwbCommunityxxList
						console.log(this.Paycost)
					}
				})
			},
        }
    }
</script>
<style lang="scss" scoped>
    /** 全局样式-开始,建议放在公共css样式文件中,比如common.css 或app.vue文件 */

    html,
    body {
        margin: 0;
        width: 100%;
        height: 100%;
        font-size: 16px
    }

    view,
    text,
    image {
        position: relative;
        box-sizing: border-box;
        flex-shrink: 0;
    }

    .flex-col {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
    }

    .flex-row {
        display: flex;
        align-items: flex-start;
    }

    .flex-col .flex-row {
        width: 100%
    }

    /** 全局样式-结束*/

    .homepage {
        padding: 72rpx 0rpx 500rpx 40rpx;
		background-color: #dbf1e1;

        .wrapper {
            width: 690rpx;
            padding: 35rpx 0rpx 47rpx 11rpx;
            border-width: 2rpx;
            border-style: solid;
            border-color: #c8c9cc;
			border-radius: 18rpx;
			background: #f3f4f6;
			margin-bottom: 50rpx;

            .text {
                width: 184rpx;
                margin: 0rpx 0rpx 22rpx 38rpx;
                font-size: 30rpx;
                font-weight: 700;
                color: rgba(103, 103, 103, 1);
            }

            .text-two {
                width: 90%;
                font-size: 40rpx;
                font-weight: 600;
                color: rgba(221, 0, 0, 1);
				margin: 0rpx 0rpx 22rpx 28rpx;
				padding: 0rpx 0rpx 20rpx 0rpx;
				border-bottom: #c8c9cc 1px solid;
				
				
            }

            .wraper-row {
                width: 546rpx;
                justify-content: space-between;
                margin: 0rpx 0rpx 42rpx 28rpx;

                .box {
                    width: 36rpx;
                    height: 38rpx;
                }

                .text-three {
                    width: 490rpx;
                    font-size: 28rpx;
                    font-weight: 700;
                    color: rgba(177, 177, 177, 1);
                }
            }

            .wraper-row-two {
                width: 646rpx;
                justify-content: space-between;
                margin-left: 8rpx;

                .button {
                    width: 302rpx;
                    height: 76rpx;
                    font-size: 34rpx;
                    background: rgba(227, 240, 255, 1);
                    font-weight: 700;
                    color: rgba(79, 111, 255, 1);
                }

                .button-two {
                    width: 316rpx;
                    height: 76rpx;
                    font-size: 34rpx;
                    background: rgba(0, 122, 237, 1);
                    font-weight: 700;
                    color: rgba(255, 255, 255, 1);
                }
            }
        }
    }
</style>